<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>文件上传</title>
    <style>
        body { font-family: Arial, sans-serif; margin: 20px; }
        .container { max-width: 500px; margin: auto; }
        label { font-weight: bold; display: block; margin-top: 10px; }
        input, button { width: 100%; padding: 8px; margin-top: 5px; }
    </style>
</head>
<body>
    <div class="container">
        <h2>上传文件</h2>
        <form id="uploadForm">
            <label for="file">选择文件：</label>
            <input type="file" id="file" required>

            <button type="button" onclick="uploadFile()">上传文件</button>
        </form>
    </div>

    <script>
        async function uploadFile() {
            const fileInput = document.getElementById('file');
            const file = fileInput.files[0];
            if (!file) {
                alert('请选择一个文件！');
                return;
            }

            const formData = new FormData();
            formData.append('file', file);

            try {
                const response = await fetch('http://127.0.0.1:8001/upload/', {
                    method: 'POST',
                    body: formData
                });

                if (!response.ok) {
                    const errorText = await response.text();  // 获取响应文本
                    console.error("Error response:", errorText);
                    throw new Error('请求失败');
                }
                const result = await response.json();
                alert(result.message);  // 提示上传成功
            } catch (error) {
                console.error("Error in uploadFile:", error);
                alert('请求失败');
            }
        }
    </script>
</body>
</html>
